<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>

	<button class="btn">my btn</button>

	<hr>

	<button class="btn2">my btn2</button>

	<hr>
	
	<script src="../lib/jquery-3.1.0.min.js"></script>
	<script>

		$('.btn').on('click', function() {
			var $this = $(this);
			$this.after('<button class="con1">my new btn</button>');
		});

		$('.btn2').on('click', function() {
			var $this = $(this);
			$this.after('<button name="con2">my new btn2</button>');
		});


		$('body').on('click', '.con1', function() {
			console.log(1);
		});

		$('body').on('click', 'button[name=con2]', function() {
			console.log(2);
		});

		// $('body').on('click', 'button', function() {
		// 	var $this = $(this);

		// 	$this.after('<button>my new btn</button>');



		// 	// console.log($this);
		// });
	</script>
</body>
</html>